<script setup lang="ts">
/**
 * 骨架结构
 * headerTitle 一级标题 + 一个按钮
 * header 装饰
 * contents 内容
 */
</script>

<template>
  <el-container class="MainPage_R-body">
    <el-header class="MainPage_header">
      <el-row type="flex">
        <slot name="headerTitle"></slot>
      </el-row>
    </el-header>
    <el-header class="MainPage_header2">
      <slot name="decoration"></slot>
    </el-header>
    <el-main class="MainPage_main">
      <slot name="contents"></slot>
    </el-main>
  </el-container>
</template>

<style scoped>
.MainPage_R-body {
  display: flex;
  /*  justify-content: center;
    align-items: center;*/
  height: 100%;
  width: 100%;
  background-color: transparent; /* #545c64*/
  border-radius: 4px 32px 32px 4px;
  box-shadow: 21px 21px 21px 0 rgba(1, 1, 0, 0);
}

.MainPage_header {
  height: 9%;
  /*background-color: #00fd68;*/
  --el-header-padding: 0 0;
  border-radius: 4px 32px 4px 4px;
}

.MainPage_header2 {
  height: 7%;
  margin: 0;
  --el-header-padding: 0 0;
  background-color: #00fd68;
  /*background-color: #00fd68;*/
}
</style>
